body {
    background-color: #F0F8FF;
}

#top {
    width: 500px;
    height: 400px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -200px 0 0 -250px;
}

.head {
    width: 65px;
    height: 65px;
    border: 4px solid black;
    border-radius: 50%;
    behavior: url(border-radius.htc);
    position: absolute;
    top: 200px;
    left: 100px;
}

[id*=eye] {
    width: 0;
    height: 2px;
    border: 3px solid black;
}

@keyframes lefteye {
    0% {
        top: 20px;
        left: 20px;
    }
    100% {
        top: 22px;
        left: 17px;
    }
}

#eye1 {
    position: absolute;
    top: 20px;
    left: 20px;
    border-radius: 50%;
    animation: lefteye 2s ease infinite;
}

@keyframes righteye {
    0% {
        top: 20px;
        left: 40px;
    }
    100% {
        top: 22px;
        left: 42px;
    }
}

#eye2 {
    position: absolute;
    top: 20px;
    left: 40px;
    border-radius: 50%;
    animation: righteye 2s ease infinite;
}

#mouth {
    width: 46px;
    height: 40px;
    border: 4px solid black;
    position: absolute;
    top: 7px;
    left: 10px;
    border-radius: 50%;
    behavior: url(border-radius.htc);
    border-top: 0;
    border-left: 0;
    border-right: 0;
}

@keyframes leftear {
    0% {
        transform: rotate(-30deg);
    }
    100% {
        transform: rotate(-56deg);
    }
}

.ear1 {
    width: 3px;
    height: 25px;
    background-color: black;
    position: absolute;
    top: 174px;
    left: 114px;
    transform: rotate(-30deg);
    animation: leftear 2s ease infinite;
}

@keyframes rightear {
    0% {
        transform: rotate(30deg);
    }
    100% {
        transform: rotate(56deg);
    }
}

.ear2 {
    width: 3px;
    height: 25px;
    background-color: black;
    position: absolute;
    top: 174px;
    left: 155px;
    transform: rotate(30deg);
    animation: rightear 2s ease infinite;
}

@keyframes circleleft {
    0% {
        top: 165px;
        left: 100px;
    }
    100% {
        top: 170px;
        left: 95px;
    }
}

.circle1 {
    width: 0;
    height: 0;
    border: 6px solid black;
    position: absolute;
    top: 165px;
    left: 100px;
    border-radius: 50%;
    animation: circleleft 2s ease infinite;
}

@keyframes circleright {
    0% {
        top: 165px;
        left: 159px;
    }
    100% {
        top: 170px;
        left: 166px;
    }
}

.circle2 {
    width: 0;
    height: 0;
    border: 6px solid black;
    position: absolute;
    top: 165px;
    left: 159px;
    border-radius: 50%;
    animation: circleright 2s ease infinite;
}

#body {
    width: 140px;
    height: 95px;
    border: 4px solid black;
    position: absolute;
    top: 185px;
    left: 177px;
    border-top-left-radius: 44%;
    border-top-right-radius: 47%;
    border-bottom-right-radius: 47%;
    border-bottom-left-radius: 44%;
}

#tail {
    width: 0;
    height: 0;
    border: 20px solid transparent;
    border-top-color: black;
    transform: skew(-23deg, -10deg) rotate(20deg);
    position: absolute;
    top: 228px;
    left: 304px;
}

@keyframes leftwing {
    0% {
        transform: skew(-12deg, -14deg);
    }
    100% {
        transform: skew(-12deg, -14deg) rotateX(30deg);
    }
}

#wing1 {
    width: 100px;
    height: 130px;
    border: 4px solid black;
    border-top-left-radius: 51%;
    border-top-right-radius: 96%;
    border-bottom-right-radius: 96%;
    border-bottom-left-radius: 69%;
    position: absolute;
    top: 70px;
    left: 245px;
    border-bottom: 0;
    transform: skew(-12deg, -14deg);
    animation: leftwing 2s ease infinite;
}

@keyframes rightwing {
    0% {
        top: 76px;
        transform: rotate(-23deg);
    }
    100% {
        top: 87px;
        transform: rotate(-27deg) rotateX(-35deg);
    }
}

#wing2 {
    width: 95px;
    height: 110px;
    border: 4px solid black;
    border-top-left-radius: 43%;
    border-top-right-radius: 32%;
    border-bottom-right-radius: 6%;
    border-bottom-left-radius: 50%;
    position: absolute;
    top: 76px;
    left: 190px;
    transform: rotate(-23deg);
    border-bottom: 0;
    border-right: 0;
    animation: rightwing 2s ease infinite;
}

#inner-left1 {
    width: 25px;
    height: 28px;
    background-color: black;
    position: absolute;
    top: 2px;
    left: 28px;
    transform: skew(11deg, -9deg);
}

#inner-left2 {
    width: 25px;
    height: 29px;
    background-color: black;
    position: absolute;
    top: 28px;
    left: 32px;
    transform: skew(4deg, -14deg);
    border-top-right-radius: 6px;
}

#inner-left3 {
    width: 25px;
    height: 47px;
    background-color: black;
    position: absolute;
    top: 47px;
    left: 30px;
    transform: skew(-9deg, 6deg);
    border-top-right-radius: 7px;
}

#inner-right1 {
    width: 26px;
    height: 32px;
    background-color: black;
    position: absolute;
    top: -1px;
    left: 80px;
    transform: skew(12deg, 0deg);
    border-bottom-right-radius: 5px;
}

#inner-right2 {
    width: 25px;
    height: 40px;
    background-color: black;
    position: absolute;
    top: 27px;
    left: 83px;
    transform: skew(-3deg, -3deg);
    border-top-right-radius: 5px;
}

#inner-right3 {
    width: 25px;
    height: 30px;
    background-color: black;
    position: absolute;
    top: 66px;
    left: 79px;
    transform: skew(-11deg, -3deg);
}
